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SYSTEM AND METHOD FOR FACILITATING USER 
INTERACTION IN A BROWSER ENVIRONMENT 

5 BACKGROUND OF THE INVENTION 

[ 1 00] The present invention relates generally to computer processing, and more 
particularly to techniques for providing a high level of user interaction for browser-based 
applications. 

[101] The World Wide Web (commonly known as the Internet) has made it 

10 possible for users to access data and software applications stored all over the world from 
their individual computers. The Internet is a collection of distributed computer networks 
that interconnect client computers with host computers through a variety of 
communication means (e.g., wireless and wireless links). Other types of computer 
network such as local area network (LAN) and wide area network (WAN) are also used 

15 to provide interconnectivity among computers. 

[102] Through a web browser executing on a client computer, a user is able to 
easily retrieve information residing on a host computer connected to the client computer 
via a network. The user initially executes the web browser on the client computer and 
then specifies a URL link for a desired webpage from the host computer. In response, the 

20 webpage is retrieved and downloaded onto the client computer. The webpage typically 
includes data and URL links to other related webpages. 

[103] The browser and computer networks provide an attractive platform upon 
which a software application designated for widespread use may be implemented. With a 
browser-based application, a host computer can perform all or the bulk of the data 

25 processing, and the client computers can interact with and obtain the required data and 
processing from the host computer via the browser. Depending on the specific design of 
the host software application, all that may be required at the client computers is the 
browser itself to obtain the required data and functionality from the host computer. 

[104] Browser-based applications can provide various advantages over other 

30 "thick client" applications, which typically require installation of specially designed 
software on both the host and client computers. These advantages include (1) ease of 
installation, since the software for browser-based applications is typically only installed 
on the host computer and not on the client computers, (2) ease of maintenance, since 
upgrades and other maintenance tasks are performed only on the host computer, (3) high 
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level of connectivity, since any user with a browser and (web) access may be able to 
interact with the host computer, and other benefits. 

[105] Conventionally, browser-based applications can support a limited level of 
user interaction due in part to the limited capabilities of the browser. Users on client 

5 computers can typically download data, execute commands, and perform other functions 
via keyboard entries and mouse clicks on specifically defined buttons and drop down 
boxes on webpages. However, as browser-based applications become more complex, a 
higher level of user interaction is needed. As an example, techniques that allow a user to 
select and associate data on one part of a webpage with an object located in another part 

10 of the webpage (e.g,, via a "drag-and-drop" operation) are highly desirable. 

SUMMARY OF THE INVENTION 

[1 06] The invention provides techniques to support various operations (e.g., 
drag-and-drop, stretch, and so on) and data manipulation in a browser environment 

15 These techniques allow data for an object located in one part of a document (e.g., a 

webpage) to be associated with another object located in the same or another part of the 
document (or possibly outside the document). These techniques also allow information 
relating to an object to be added, modified, deleted, and so on, via movements of the 
object within the document. These techniques further support various fiinctkmalities and 

20 processes to be invoked by movement of objects. Various actions needed to effectuate 
these operations and data manipulation may be performed, for example, by scripts 
included in the document itself and executed by a browser that supports dynamic HTML. 

[107] A specific embodiment of the invention provides a method for facilitating 
user interaction in a browser environment. In accordance with the method, a document 

25 (e.g., a webpage) having included therein a number of source and target objects and a 
number of scripts is initially received. Thereafter, an indication of a particular operation 
(e.g., a drag-and-drop operation) being initiated on a selected source object is received. 
In response, a script for the selected source object is executed to generate a data transfer 
object having included therein data associated with the selected source object. An 

30 indication of the particular operation being completed on a selected target object is 

subsequently received. In response, a script for the selected target object is executed to 
operate on the data included in the data transfer object to effectuate the (e.g., drag-and- 
drop) operation, which may entail calling the host computer to update the selected source 
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and target objects. The particular operation may be performed to manipulate data and/or 
to associate data for one object with another object 

[ 1 08] As the selected source object is moved about the webpage toward its 
intended target, the representation (e.g., a box) for each potential target object may be 
5 modified (e.g., with a change in color), the mouse cursor may be changed, or some other 
feature of the display may be modified to show whether or not a drop of the selected 
source object onto the target object is permitted. The modification may be performed by 
the script for the potential target object. The change in the potential target object's 
representation or the mouse cursor helps to guide an end-user with the drag-and-drop 
10 operation. 

[109] Another specific embodiment of the invention provides a document (e.g., a 
webpage) capable of facilitating user interaction in a browser environment The 
document includes at least one applet for at least one display window. Each applet 
includes at least one browser object that is representative of an entity (e.g., an activity, an 
1 5 employee) for an end application (e.g., a dispatch system, which is described below). 

Each browser object is further associated with a respective set of one or more scripts used 
to facilitate a set of one or more operations (e.g., drag-and-drop and stretch operations) 
permitted for the browser object. 

[110] Each browser object may be a source object if it can be selected to 
20 originate a particular operation, and may (alternatively or additionally) be a target object 
if it can be selected as a destination for a particular operation. In this case, the script for 
each browser object would perform the appropriate set of actions depending on if the 
browser object is selected as a source object or a target object for a particular operation. 

[Ill] The invention further provides other methods, documents (e.g., webpages), 
25 software codes, and systems capable of implementing various aspects, embodiments, and 
features of the invention, as described in further detail below. 

[112] The foregoing, together with other aspects and embodiments of this 
invention, will become more apparent when referring to the following specification, 
claims, and accompanying drawings. 

30 

BRIEF DESCRIPTION OF THE DRAWINGS 

[113] FIG. 1 is a diagram illustrating a computer network in which various 
aspects and embodiments of the invention maybe implemented; 
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[114] FIGS. 2A through 2C illustrate three documents (e.g., webpages) capable 
of facilitating various operations, in accordance with embodiments of the invention; 

[115] FIG. 2D shows a document for an embodiment of an Options menu used to 
configure the display of other documents; 
5 [116] FIG. 3 is simple a diagram illustrating an embodiment of a document (e.g., 

a webpage); 

[117] FIG. 4 is a flow diagram of an embodiment of a process to effectuate a 
drag-and-drop operation in a browser environment; and 

[118] FIG. 5 is a block diagram of a computer system. 

10 

DESCRIPTION OF THE SPECIFIC EMBODIMENTS 

[1 19] FIG. 1 is a diagram illustrating a computer network 100 in which various 
aspects and embodiments of the invention may be implemented. Computer network 100 
may include any number of client computers 120 coupled to one or more host computers 

15 1 1 0 via a network 1 30, which may be the Internet, a LAN, a WAN, some other type of 
network, or a combination thereof Only one client computer and one host computer are 
shown in FIG. 1 for simplicity. 

[120] In the embodiment shown in FIG. 1, host computer 1 1 0 includes runtime 
engines 1 12, an object manager 1 14, and a data manager 1 16. Runtime engines 112 

20 execute one or more software applications that provide the required functionality. An 
example software application for a dispatch system is described in further detail below. 

[121] Object manager 1 14 interfaces with runtime engines 1 1 2 and manages the 
interaction with a central database 118. In an embodiment, object manager 1 14 manages 
business objects (BO), business services (BS), and business components (BC) (all three 

25 not shown in FIG. 1 for simplicity). The business objects model major entities (e.g., 

schedules, activities, and employees for the dispatch system) for the software applications 
with associated business rules. Each business object is made up of a hierarchy of parent- 
child components, which model relationship with appropriate specialized operations. The 
business services are basic components for building complex behavior. New business 

30 services may be created and linked into multi-step control flows to provide complex 

behavior encompassing multiple business objects. The business components provide real 
time access to remote objects without replication of data within database 118. A business 
object may be made up of a number of business components managed by the runtime 
engines. 
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[ 1 22] Data manager 1 1 6 manages database 1 1 8 and, in an embodiment, performs 
this function by invoking SQL objects. Database 1 18 stores data for the software 
applications executed by runtime engines 1 12 and typically stores the data in a "raw" 
form based on a particular schema. 

5 [ 1 23] In an embodiment, client computer 1 20 includes a web browser 1 22, 

(optional) runtime engines 124, and a local storage 126. Web browser 122 is a client 
software program that uses Hypertext Transfer Protocol (HTTP) to make requests of 
servers (e.g., host computer 1 10) on behalf of a browser user. Web browser 122 provides 
user interface (e.g., screens) to present information to the user and further receives and 

10 interprets user inputs (which may be provided via mouse clicks, mouse movements, 
keyboard inputs, and other means). Web browser 122 also provides the means to 
download and send data (e.g M from/to host computer 1 10) and to process the data based 
on the user inputs. Web browser 122 maybe a commercially available software 
application such as Navigator™ from AOL-Time Warner, Inc. or Internet Explorer™ 

1 5 from Microsoft Corporation. 

[124] For certain embodiments, client computer 120 may include runtime 
engines 1 24, which may execute all or some of the software applications executed on 
runtime engines 1 12 at host computer 1 10. Runtime engines 124 allow some of the 
processing to be performed by client computer 120, which may alleviate the amount of 

20 data exchanges between client computer 120 and host computer 1 1 0. Runtime engines 
124 further allow client computer 120 to be operated in a stand-alone configuration (i.e., 
not connected to host computer 110) when necessary or as desired. 

[125] Local storage 126 stores data for web browser 122 and runtime engines 
124. For example, documents (e.g., webpages) are retrieved from host computer 1 10 by 

25 web browser 122 and stored to local storage 1 16 to allow for fast and efficient access to 
the webpages. Local storage 1 16 may be implemented with a semiconductor memory 
(e.g., RAM, Flash), a haid disk, or some other data storage technology that can provide 
fast access to the data stored thereon. 

[126] The invention provides various techniques to support a higfr level of user 

30 interaction and data manipulation in a browser environment. In an aspect, a framework is 
provided which supports various operations on objects and further allows for complex 
manipulation of data. The framework defines various types of data element (i.e., 
browser objects", which are records of data), various types of display representation for 
the data elements (e.g., a list table, a Gantt chart, and so on), and various operations (e.g., 
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drag-and-drop) that may be performed on the data elements. For each supported 
operation, the framework defines a set of actions to be performed by/on the affected data 
elements to effectuate the operation. Within this defined framework, data may be 
manipulated in various ways via the supported operations, and various other 
5 functionalities and processes may also be supported. For example, an object located in 
one part of a document (e.g., a webpage) maybe associated with another object located in 
another part of the document Yia a drag-and-drop operation. 

[ 1 27] Various aspects and embodiments of the invention may be implemented 
within computer network 100, which may be used to support various types of software 

10 application, such as customer relationship management (CRM) applications, employee 
relationship management (ERM) applications, and others. For clarity, various aspects and 
embodiments of the invention are described for a specific CRM application, which is a 
dispatch system used to assign and schedule activities to employees. Moreover, although 
the techniques described herein may be used in conjunction with various types of 

15 documents, for clarity, various aspects and embodiments of the invention are specifically 
described for webpages or HTML documents. 

Webpage for Dispatch Board 

[128] FIG. 2A illustrates a document 200a (e.g., a webpage) for a "dispatch 
20 board", which is used to display information for activities and employees and to facilitate 
the assignment and scheduling of activities, in accordance with a specific embodiment of 
the invention. The dispatch board may be used by a dispatcher (i.e., an end-user) to (1) 
display the available and pertinent information in a clear and organized manner to allow 
the dispatcher to make prompt and cost-effective decisions for assignments of activities to 
25 employees, (2) provide extensive capabilities to add, change, and schedule assigned 
activities, and (3) perform other functions. 

[ 1 29] The dispatch board includes main tabs 21 2 and a main display area 220. 
Main tabs 212 may be used to invoke various end applications, functionality, and features 
provided by the overall system. In such a design, the dispatch system may represent just 
30 one of multiple available end applications. 

[ 1 30] Main display area 220 may be used to present information for the selected 
end application. In the specific embodiment shown in FIG. 2A, main display area 220 
presents information for the dispatch system and includes an Activity Gantt Chart 
"applet" 230 used to display the available employees and their scheduled activities and an 
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Unscheduled Activities applet 260 used to display unscheduled activities. As used herein, 
an applet is a high-level object for a display window used to present a particular 
collection of data. The display window may be defined to have any size and shape, 
although a rectangular shape is typically used. An applet presents data in a specific 
5 layout and design, and multiple applets may be designed and used to display the same 
collection of data. A document may be designed to include any number of applets. 

[131] Each applet typically includes a number of fields, and each field may 
represent a particular type of data, a particular parameter, a particular action that may be 
performed in the applet, and so on. Each field is typically represented with a lower-level 
10 object, which may be a button, a list box, a display region, or some other representation. 

Activity Gantt Chart Applet 

[ 1 32] FIG. 2 A shows an embodiment of Activity Gantt Chart applet 230 (or 
simply, a chart applet) used to display a schedule for a particular time window for the 
15 dispatch system. In the embodiment shown, chart applet 230 includes a header 232 
having (1) date Ust boxes that allow the dispatcher to select the starting date for a Gantt 
chart displayed in applet 230, (2) a section that lists the service region and employees 
covered by the Gantt chart, and (3) a Ust box that allows the dispatcher to select a 
particular time zone. 

20 [ 1 33] In an embodiment, chart applet 230 displays a current schedule for a group 

of employees using a Gantt chart. Other types of chart may also be used and are within 
the scope of the invention. The Gantt chart displays data on a y-axis versus x-axis to 
show scheduled activities and other events versus time. The two top rows of the Gantt 
chart display headers with date and (if appropriate) time information. Each data row 

25 below the header rows corresponds to a record 234 and may be used to display a schedule 
for an employee. The specific group of employees to be displayed in chart applet 230 
may be selected based on one or more criteria (e.g., by service regions, employees, skills, 
parts, and so on). 

[1 34] The first column in the Gantt chart is a header column used to identify the 
30 employees. Each column to the right of the header column is a data column used to 
display assignment and scheduling information. Each data column covers a particular 
time slot, which is one week for the specific embodiment shown in FIG. 2A but other 
time slots may also be selected by the dispatcher via an Options menu. The width of the 
data columns may be fixed (e.g., by a default value), and the number of columns is 
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typically determined by the size of the display window. The chart may be configured to 
display a particular time window (e.g., several months) of a calendar. The dispatcher may 
configure the Gantt chart (e.g., via the date list boxes in header 232) to display a different 
time window (e.g., a different set of months) of activities or may configure the chart (e.g., 
5 via the Options menu) to display a different-size time window (e.g., one week) of 
activities, in which case the time slot covered by each data column is correspondingly 
changed. 

[135] Each cell in the Gantt chart is formed by the intersection area between one 
row and one column. The cells in the data columns (i.e., data cells or data boxes) may be 

10 configured to display data using one or more schemes (e.g., with different colored boxes, 
outline, shading, text, or a combination thereof). The data displayed in these data cells 
may span multiple cells in the same row. In one embodiment, data is constrained from 
spanning multiple cells in the same column. In an alternative embodiment, data maybe 
allowed to span multiple cells in the same column (e.g., if two or more employees are 

1 5 needed or recommended for a particular activity). 

[136] Scroll buttons 236 are provided to allow the dispatcher to span (or scan) 
across columns in the grid portion of the Gantt chart, i.e., the data columns. A vertical 
bar or vertical scroll buttons may also be provided, if needed, to allow the dispatcher to 
scroll through the available employees across rows, except the header rows. The 

20 horizontal and vertical scroll buttons may be made visible on the display window (e.g., 
automatically, if necessary) based on the amount of data to be displayed. 

[137] Various schemes may be used to present data in the grid portion of the 
Gantt chart (i.e., the data portion, except the header rows and column). In one scheme, 
data is displayed as solid colored boxes with outline. Each data box represents a 

25 particular "event", which may be an activity that has been assigned and scheduled or 
some other information (e.g., non-schedulable or non-working times for an employee). 
The outline of a data box typically corresponds to the time duration for the associated 
event (e.g., the scheduled time for an activity). In an embodiment, the dispatcher may be 
able to expand or shrink the size of a data box by using the mouse (e.g., by clicking on an 

30 edge of the box and dragging the edge). 

[138] The color of each data box may be based on a particular color-coding 
scheme that typically uses different colors to differentiate between different types of 
event (e.g., different types of activity). For example, non-schedulable times for 
employees may be represented with data boxes of one color (e.g., orange), and scheduled 
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activities may be represented with data boxes of another color (e.g., green) or boxes of 
different colors to represent their status and priority. The color scheme may be 
configurable to suit the preferences of the individual dispatcher. 

[1 39] The data boxes may also be configured to display additional information 
5 related to the associated events (e.g., activity type, status, account, description, and so on, 
or a combination thereof). If the text is too long to fit in a data box, then it may be 
abbreviated or truncated. The data boxes may also be configured such that full text is 
displayed for an event when the cursor is placed over the box (e.g., without the need to 
click on the mouse button). 

10 

Unscheduled Activities Applet 

[140] FIG. 2 A also shows an embodiment of Unscheduled Activities applet 260 
used to display a list of unscheduled activities. In the embodiment shown, Unscheduled 
Activities applet 260 includes a header 262 having (1) an Edit button that allows the 

15 dispatcher to edit a selected unscheduled activity, (2) a Query button that allows the 
dispatcher to search for unscheduled activities, and (3) scroll buttons that allow the 
dispatcher to display other fields for the unscheduled activities. 

[141] In an embodiment, Unscheduled Activities applet 260 displays a list of 
unscheduled activities using a list table, and is thus referred to as a list applet. Other 

20 types of display may also be used and are within the scope of the invention. The top row 
of the list table displays headers for various fields of the unscheduled activities. Each 
data row below the header row corresponds to a record 264 and may be used to display a 
particular unscheduled activity. The specific activities to be displayed in list applet 260 
may be selected based on one or more criteria (e.g., by service region). The number of 

25 data rows (i.e., the number of records 264) to be displayed in list applet 260 may be 
determined by the size of the display window, and scroll arrows are provided (if 
necessary) to allow the dispatcher to scroll through all applicable activities. 

[142] In an embodiment, each record included in list applet 260 is associated 
with an object in a column 266, which may be used for various operations (e.g., drag-and- 

30 drop, as described below). In another embodiment, any field of record 264 may be 
selected and used for the supported operations. 

[143] Various other designs and features may also be used for the chart applet 
and the list applet. An alternative design is described in U.S Patent Application Serial 
No. 09/810,007, entitled "System and Method for Assignment and Scheduling 
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Activities," filed 3/16/01, assigned to the assignee of the present application and 
incorporated herein by reference. 

[144] For the dispatch system, activities may be generated by various means 
such as by operators in a call center, by customers via the web, and so on. These 
5 activities are initially categorized as unscheduled in most instances and may be selected 
for display in list applet 260, which is then the starting point for assigning and scheduling 
activities. 

[ 145] FIG. 2B shows a webpage 200b in which additional information is 
provided via a pop-up applet 270 (e.g., to assist the end-user perform certain operations). 

10 In this example, pop-up applet 270 is displayed in response to the end-user clicking on a 
record in list applet 260, and includes various types of information for the activity 
represented by the selected record. Although not shown in FIG. 2B, pop-up applets may 
also be used to provide additional information for other items in the webpage such as, for 
example, the employees listed in chart applet 230, the scheduled activities and other 

1 5 events in the Gantt chart, and so on. 

Drag-and-Drop Operation in a Browser Environment 

[146] A high level of user interactivity may be provided for the dispatch board to 
facilitate the assignment and scheduling of activities to the available and qualified 

20 employees. In particular an unscheduled activity may be assigned and scheduled by 
selecting the activity in list applet 260, dragging the selected activity over to a particular 
employee and for a particular time slot in chart applet 230, and dropping the activity on 
the target employee and time slot. This "drag-and-drop" operation may be implemented 
with a software application executed on the client computer (i.e., a "thick client**), as 

25 described in the aforementioned U.S Patent Application Serial No. 09/8 1 0,007. 

[ 147] Implementation of the drag-and-drop operation in a browser environment 
is much more challenging than for a thick client because most browsers provide only a 
limited set of events that may be used to effectuate the drag-and-drop operation. In 
particular, Internet Explorer™ 5 provides 21 different events for a Document class object 

30 that may be used to represent a webpage (i.e., an HTML document). Of these, seven 
events relate to drag and drop actions and are listed below: 

• ondrag - this event fires continuously on a source object during a drag operation; 



10 



WO 03/030013 



PCT/USQ2/30426 



• ondragstart - this event fires on the source object when the user first starts to drag 

a selection of text or an object (i.e., a document item) associated with the 
source object; 

• ondragenter - this event fires on a target object when die document item being 
5 dragged enters a drop target that is valid; 

• ondragover - this event fires on the target object while the document item being 

dragged is over the valid drop target; 

• ondragleave - this event fires on the target object when the document item being 

dragged moves out of the valid drop target; 
10 • ondragend - this event fires on the source object at the close of the drag operation 
when the mouse is released; and 

• ondrop - this event fires on the target object during a drag-and-drop when the 

mouse is released. 

[148] An aspect of the invention provides techniques to effectuate drag-and-drop 
1 5 operations in a browser environment to allow data for an object located in one part of a 
webpage (e.g., list applet 260) to be associated with another object located in the same 
part or another part of the webpage (e.g., chart applet 230), Various actions needed to 
effectuate drag-and-drop operations may be performed by scripts executed by a browser 
that supports dynamic HTML. 

20 

Browser Object 

[149] In general, a document (e.g., a webpage) may be designed to include any 
number of applets, and each applet may be for a respective display window, such as 
applets 230 and 260 in FIG. 2A for a Gantt chart and a list table, respectively. Each 
25 applet may further include any number of (i.e., zero or more) "source" objects and any 
number of (i.e., zero or more) "target" objects. Each source object may be selected and 
dragged via a drag-and-drop operation. Each target object may be a destination upon 
which a source object may be dropped, if a set of (zero or more) criteria specified for the 
drop is satisfied. 

30 [1 50] In an embodiment, each source object may be associated with pertinent 

data related to an entity (e.g., an activity on the dispatch board) that is represented by the 
source object. For an activity, the pertinent data may include the account name, the 
activity's type and location, its status and priority, the skills, parts, and time duration 
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required to perform the activity, the due date, the earliest and latest start times, and so on. 
In an embodiment, each source object is further associated a respective script (i.e., 
program codes) that performs the necessary processing at the start of a drag-and-drop 
operation. 

5 [ 1 5 1] In an embodiment, when a source object is selected and a drag is initiated, 

the selected source object's script generates a "data transfer object" for the drag-and-drop 
operation. In one embodiment, this data transfer object includes some or all of the 
pertinent data associated with the selected source object, and the included data may be 
used for various actions during the drag-and-drop operation. For a source object that 
1 0 represents an activity, the data transfer object generated by the source object may include 
some or all of the data described above. In another embodiment, this data transfer object 
includes a link to the source object from which pertinent data may be obtained. The data 
transfer object may also be implemented in other manners and this is within the scope of 
the invention. 

15 [152] Each target object similarly represents a particular entity on an applet. For 

the dispatch board shown in FIG. 2 A, each target object in chart applet 230 may represent 
a respective data box in the grid portion of the Gantt chart, and this data box covers a 
particular time slot for a particular employee included in the Gantt chart. Each target 
object may also be associated with pertinent data related to the entity represented by the 

20 target object. For the Gantt chart, the pertinent data for each data box may include (1) the 
time duration being represented by the data box, and (2) the data for the employee 
associated with the data box. Each data row in the Gantt chart corresponds to a record for 
an employee and may be identified by a respective record K>. Each data column in the 
Gantt chart corresponds to a particular time slot and may also be identified by a 

25 respective column ID. Each data box may thus be identified by its respective set of 
record and column IDs, and the pertinent data for the data box may be obtained by first 
identifying the record and column IDs. 

[ 1 53) In an embodiment, each target object is further associated with a respective 
script that performs the necessary processing to guide and/or complete a drag-and-drop 

30 operation. In an embodiment, the target object's script performs a first set of actions 
when the document item for a selected source object (or just simply, the selected source 
object) is dragged into the target object, a second set of actions when the source object is 
dragged out of the target object, and a third set of actions if the source object is dropped 
onto the target object. The specific actions to be performed are dependent on the data 
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associated with the source and target objects and the specific design of the target object's 
script. 

[ 1 54] When a selected source object is dragged into a target object, the target 
object's script executes and determines whether or not a drop of the source object onto 
5 the target object is permitted. This determination can be made by extracting the data 
included in the data transfer object (which is generated by the source object for the drag- 
and-drop) and checking the extracted data with the pertinent data associated with the 
target object. For the dispatch board, the following may be performed (1) the skills and 
parts required to perform the activity may be checked against the capabilities of the target 

10 employee, (2) the location where the activity is to be performed may be checked against 
the service region where the employee is based, (3) the due date, time duration, and 
earliest and latest start times for the activity may be checked against the availability of the 
employee, and so on. These checks (or tests) effectively form a set of one or more 
criteria for the drop and may be specified in the target object's script. 

15 [ 1 55] In an embodiment, the target object's script may modify the applet's 

display window depending on whether or not a drop of the selected source object onto the 
target object is permitted. If a drop is permitted, then the data box for the target object 
may be modified (e.g., by a change to a new color, such as green), a pop-up applet may 
be generated with the appropriate text (e.g., "drop OK"), an icon at the tip of the cursor 

20 may be changed (e.g., to a different shape), and so on. Otherwise, if a drop is not 

permitted, then the data box maybe maintained or modified differently (e.g., by a change 
to a different color, such as red), a pop-up applet may be generated with the appropriate 
text (e.g., "drop not permitted*'), the cursor icon may be maintained or changed 
differently, and so on. The modified display may be maintained for the duration in which 

25 the source object is over the target object. 

[156] When the selected source object is dragged out of the target object, the 
target object's script can restore the display window to its original condition (i.e., prior to 
the source object being dragged into the target object). This may entail changing the data 
box for the target object back to its original color, removing the pop-up applet, and so on. 

30 [157] As the selected source object is dragged over a series of target objects, 

each affected target object's script executes at the appropriate times, as the source object 
is moved into and out of the target object, to highlight the display window to assist in the 
drag-and-drop operation. 
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[158] When the selected source object is dropped onto a particular target object, 
and if the drop is permitted, the target object's script executes and performs a set of 
actions to effectuate the drop. A wide variety of actions may be performed by the target 
object's script, depending on its specific design. For example, the target object's script 
5 may (1) extract the data included in the data transfer object, (2) initiate a call to the host 
computer to notify it of the drop and provide the extracted data, (3) receive and display 
updated data from the host computer (e.g., an updated webpage), (4) generate emails to 
notify the affected employee^) of the drop, and so on. 

[159] Each successful drag-and-drop operation may thus be associated with a 

1 0 particular source object, one or more target objects that are potential drop targets, and a 
particular target object that is the actual drop target. The source object and actual drop 
target may be located within the same or different applets. 

[160] In an embodiment, a host software application executing on runtime 
engines 112 at the host computer performs the processing required to effectuate a drop. 

1 5 This software application further maintains a central database for the system and updates 
this database upon receiving the notification of the drop from the client computer. For the 
dispatch system, this database update may include modifying the status of the affected 
activity from unscheduled to scheduled (or vice versa, if the activity is being de- 
scheduled), updating the schedule for each affected employee, updating the schedule for 

20 the service region, and so on. 

[161] In another embodiment, a client software application executing on runtime 
engines 124 at the client computer maintains a temporary database and updates this 
database upon receiving the notification of the drop. This client software application and 
temporary database may be used to reduce the amount of traffic exchanged between the 

25 client and host computers, which may improve performance. Periodically and/or as 
necessary, the temporary database at the client computer may be synchronized (i.e., 
updated) to the central database maintained by the host computer. 

[162] For enhanced flexibility, various characteristics of the drag-and-drop 
operation may be configured via drag-and-drop fields specified within a Tools menu. Via 

30 the Tools menu, an administrator may be able to set what fields are to be updated upon 
completion of a drag-and-drop operation. Different sets of fields may be changed 
depending on the specific applet in which the source object is located and the specific 
applet in which the target object is located. For the dispatch system, different sets of 
fields maybe changed if a source object is dragged from list applet 260 into chart applet 
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230, from chart applet 230 to chart applet 230, or from chart applet 230 into list applet 
260. Some fields thai may be filled for a drop include (1) the Planned Start Time for an 
activity scheduled via the drag-and-drop operation , which maybe set to the start time 
indicated by the data box where the drop occurred, (2) the status of the activity, which 
maybe set to "scheduled", (3) the No Sooner Than time for the activity, which may be set 
to the Planned Start Time, and so on. 

[163] Each applet on a webpage may include any number of (zero or more) 
'"browser objects". Each browser object may be a source object, a target object, or 
possibly both a source and a target object. Referring to FIG. 2A> each activity (i.e., each 
data row) in list applet 260 may be associated with a respective browser object that can be 
the source object for a drag-and-drop operation to schedule the activity. Each activity in 
list applet 260 may also be a target object for a drag-and-drop operation to unschedule an 
activity that was previously scheduled. Thus, a browser object may be associated with a 
first script that is executed if the browser object is selected as a source object and a 
second script that is executed if the browser object is selected as a target object. In an 
embodiment, the specific script to be executed is determined by the specific event being 
fired on the browser object (e.g., ondragxxx or ottdrop). 

[164] Referring to FIG. 2A, each browser object in chart applet 230 may be a 
target object for a drop of a source object (e.g., an activity) or may be a source object that 
is dropped onto another target object. For example, to reschedule an activity, the source 
object for the activity may be selected, dragged over to another target object for another 
employee and/or another time slot, and dropped onto that target object. A scheduled 
activity may also be de-scheduled by selecting the source object for the activity, dragging 
it over to list applet 260, and dropping it (e.g., anywhere) on the list applet. 

[165] Each browser object may be associated with various types of information. 
In a specific embodiment, each browser object includes the following: 

• the identity of the particular business object that represents the browser object 

(e.g., the business object for an activity or an employee); 

• the identity of the database fields that need to be modified to effectuate each 

supported action (e.g., a scheduling, a cancellation, a re-assignment, a de- 
scheduling) that may be achieved via the drag-and-drop operation; 

• the record ID for the record that may be dragged (e.g., the row ID for list applet 

260); 
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• the specific actions that may be performed for, or on, the browser object; 

• additional information that may be needed to perform other actions (e.g., names of 

the fields from which contact names may be picked up to send notification 
emails). 

5 [ 1 66] FIG. 3 is simple a diagram illustrating an embodiment of a document 300, 

which may represent a particular webpage (e.g., for the dispatch board shown in FIG. 
2A). Document object 300 includes a set of one or more applets 310. Each applet 310 
may be used for a particular display window (e.g., for the Gantt chart or the list table 
shown in FIG. 2A). Each applet 310 may further include one or more scripts 312 for one 

1 0 or more browser objects included in the applet. Each applet 3 1 0 further includes a body 
314 that defines the display window for that applet. In the embodiment shown in FIG. 3, 
document 300 includes all data and scripts needed to display the corresponding webpage 
and to effectuate drag-and-drop operations on browser objects included in the webpage. 
[167] Document 300 may be downloaded from the host computer onto the client 

• 1 5 computer in response to a request for a new document or in response to a drag-and-drop 
operation on a selected object. Document 300 is typically stored to the local storage (e.g., 
a cache) in the client computer, and the necessary portion of the document may be 
accessed from the local storage and operated on by the scripts as necessary. For example, 
a data transfer object generated by the source objects* script may be stored to the local 

20 storage until needed. 

[168] In an embodiment, to reduce the amount of traffic to be exchanged by the 
client and host computers and to further reduce unnecessary processing, data is loaded as 
needed Each document includes data for a specific time window, e.g., as requested by 
the end-user. If the end-user requests data for another time window, then another 

25 document for that time window may be generated and provided to the client computer. 

[169] FIG. 4 is a flow diagram of a process 400 to effectuate a drag-and-drop 
operation in a browser environment, in accordance with an embodiment of the invention. 
Initially, a particular source object located in one part of a webpage (e.g., a particular 
activity in list applet 260) is selected (e.g., via amouse click), at step 412. The selected 

30 source object may be appropriately highlighted (e.g., with a different color, shading, or 
shape). Next, an indication is received of a drag being initiated on the selected source 
object, at step 414. The drag may be initiated by depressing the mouse while it is placed 
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over the source object and moving the depressed mouse. The drag start may be indicated 
by the firing of the ondragstart event on the selected source object. 

[170] In an embodiment, each source object is associated with a script that may 
be executed in response to the occurrence of a specific event (e.g., the ondragstart event). 
5 Upon receiving the indication of the firing of the ondragstart event, the script for the 
selected source object generates a data transfer object that includes various types of data 
derived from a record associated with the selected source object, at step 416. The data 
transfer object may be stored to the local storage and may thereafter be used by other 
target objects to effectuate the drag-and-drop operation. 

10 [ 1 71] As the mouse is moved over various parts of the webpage, an indication 

may be received of the data transfer object being dragged into a potential drop target, at 
step 41 8. A potential drop target is a browser object on the webpage that may potentially 
receive the selected source object, e.g., if certain specified criteria are satisfied The 
"drag enter" may be indicated by the firing of the ondragenter event on the potential drop 

15 target. 

[172] Upon receiving the drag enter indication, the potential drop target executes 
its script, which then operate on the data included in the data transfer object. This script 
may perform certain actions to effectuate this portion of the drag-and-drop. For the 
dispatch system, the script can determine (1) whether or not the employee associated with 

20 the potential drop target has the required skills and parts for the activity represented by 
the selected source object, (2) whether or not the time period required for the activity can 
fit within the available time of the employee, and so on. The script then modifies the 
display based on the results of the determination, at step 420. For example, if all criteria 
are satisfied, then the display can be modified to signal that a drop onto this drop target is 

25 permitted (e.g., by a change of color on the data box for the potential drop target, by 

displaying a pop-up applet with the appropriate text, and so on). Otherwise, if all criteria 
for a drop are not satisfied, then the display can be modified to signal that a drop onto this 
drop target is not permitted (e.g., by not changing the appearance of the data box for the 
potential drop target, or by changing it to another color, and so on). The modified display 

30 may be maintained for as long as the data transfer object is within the potential drop 
target. 

[1 73] If the data transfer object is thereafter dragged out of the potential drop 
target, an indication may be received of such event, at step 422. This "drag out oF may 
be indicated by the firing of the ondragleave event on the potential drop target Upon 
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receiving such indication, the script can restore the display to it previous condition, at step 
424. Steps 41 8 through 424 may be performed each time the data transfer object is 
dragged over a potential drop target. 

[174] Subsequently, an indication may be received of the data transfer object 
5 being dropped onto a drop target object, at step 426. This drop may be achieved by 
releasing the mouse button and may be indicated by the firing of the ondrop event on the 
drop target object. Upon receiving the drop indication, the drop target object's script 
executes and performs the necessary actions to effectuate the drag-and-drop, at step 428. 
A wide variety of actions may be performed by the script, depending on its design, as 

10 described above. 

[175] The webpage maybe updated in various ways to reflect the drag-and-drop 
operation. In one embodiment, upon receiving and processing the drop at the host 
computer, an updated webpage having updated data is sent to the client computer, which 
then displays the webpage. In another embodiment, the host computer sends updated data 

1 5 for only the affected portions of the webpage, such as the records for the source and target 
objects. The client computer then updates only the affected portions with the received 
data. In yet another embodiment, the client computer performs the processing for the 
drop and updates the entire webpage or only the affect portions of the webpage. 

20 Other User Interactions 

[176] The techniques described herein to implement drag-and-drop operation in 
a browser environment may also be used to implement other operations on browser 
objects included in a webpage. Some of these operations are described below. Other 
operations may also be implemented and are within the scope of the invention. 

25 [1 77] Resizing Action . A data box (e.g., the time for a particular activity in chart 

applet 230) may be extended or shortened via a "stretch" operation. This operation may 
be accomplished by selecting an edge of the data box and dragging the edge to a desired 
width. The browser is able to distinguish between the edge and the body of the data box. 
When an edge is selected, the shape of the cursor may be changed (e.g., similar to that 

30 when a column in a list or a chart is selected for adjustment). 

[178] If the selected edge is dragged over onto another target object, the display 
may be modified and/or highlighted according to assist with the stretch operation. For 
example, the data box for the potential target object maybe changed to one color (e.g., 
green) if the selected data box (e.g., for an activity) can be stretched into this target 
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object, or may be changed to another color (e.g., red) if the data box cannot be stretched 
into the target object. Similar to the drag-and-drop operation, the script for the selected 
source object may be designed to effectuate the stretch operation (e.g., generate the data 
transfer object upon initiation of a stretch operation). 

5 [179] Pop-Up Applet . If a particular browser object (e.g., on the Gantt chart) in 

the webpage is selected, a pop-up applet may be generated and used to show additional 
information for the selected object, as shown in FIG. 2B. The data in the pop-up applet 
may also be edited (e.g., direcdy on the pop-up applet). The specific fields to be 
displayed on the pop-up applet may be made configurable via the Tools menu. 

10 [180] New Items . A new item may be created on an applet (e.g., on the Gantt 

chart) by clicking and dragging in an open area. Information for the newly created item 
may be entered (e.g., by the end-user) or may be extracted from other objects included in 
the applet or the webpage. 

15 Generic Applet and Object Classes 

[181] FIG. 2A shows a specific design of a webpage for the dispatch system. In 
general, other webpages may be designed for other end applications. In an embodiment, 
the Gantt chart applet and the list applet are designed as generic classes of object. These 
applets may then be tailored for specific end applications by populating die chart and list 

20 applets with different headers and different types of data. For the dispatch system, which 
is a specific end application, the Gantt chart is populated with employees (e.g., for a 
particular service region). For other end applications, the header (i.e., leftmost) column in 
the Gantt chart may be filled with the other types of "axis objects'* instead of employees. 
Various schemes maybe used to populate the chart and list applets, and some of these 

25 schemes are described below. 

[1 82] In a first scheme, the specific list applet selected for display on a webpage 
determines the data to be displayed in the Gantt chart on the webpage. For example, if 
the list applet includes activities as shown in FIG. 2A, then the Gantt chart includes 
employees to which the activities may be assigned and scheduled. 

30 [183] In a second scheme, the columns in the Gantt chart are programmatically 

filled by passing either an array or a reference to a designated table, which then identifies 
the specific axis objects (e.g., the specific employees) to be used for the header column. 
As an example, a Find Employees table maybe used to store the results of a search for 
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employees based on some particular set of criteria, and the results in this table may then 
be funneled into the header column of the chart applet. 

[ 1 84] In a third scheme, an end-user can manually adds axis objects or modify an 
existing list of axis objects, e.g., by right-clicking and selecting a 6l New Record" button 
5 provided on the chart applet. This user action would not create a new axis object, but 
merely adds an already defined axis object to the list. The end-user may also remove an 
axis object from the list by selecting a 'Delete Record" button provided on the chart 
applet 

[ 1 85] In a fourth scheme, an administrator may be able to select (via the Tools 

10 menu) the specific type of business objects to be used as the axis objects (e.g., employees) 
and the specific type of business objects to be used for the list applet (e.g., activities). 
The administrator may also select the specific fields of these business objects to be 
mapped to the fields defined in the Gantt chart and list applets. For example, for a 
Professional Service application, a "Project Start" field and a "Project Complete" field for 

1 5 a business object may be mapped to a Planned Start" field and a "Planned Complete" 
field, respectively, defined for the applet. 

[186] In designing generic classes of object for the Gantt chart applets and list 
applets, not all fields may be used by all end applications. In this case, the fields not 
required by an end application may be turned off. For example, if a "Due Date" logic is 

20 not required, then it is not applied for drag-and-drop operations. 

[1 87] FIG. 2C shows a webpage 200c for a marketing application. In this 
application, a Gantt chart applet 230c displays "campaigns" for the axis objects of the 
Gantt chart (instead of employees), and a list applet 260c displays various campaign 
programs (instead of activities). The programs in list applet 260c may be scheduled on 

25 the Gantt chart via drag-and-drop operations, as described above. Via the Gantt chart, the 
end-user is able to visualize the planned campaigns for the overall marketing strategy, 
which can assist in designing effective campaigns. 

[188] The Gantt chart and list applets may thus be used to display information 
for various end applications. 

30 [1 89] For enhanced flexibility, the various operations that may be performed on 

the browser objects in a given webpage may be configured via the Tools menu. In an 
embodiment, the administrator or end-user may enable and disable (i.e., turn on and off) 
specific operations for each type of browser object, and may further select the specific 
properties that apply. 
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Features and Capabilities 

[ 1 90] The techniques described herein may be used for various end applications, 
to support various operations in addition to those described above, and for manipulation 
5 of data in other ways to achieve various results. Some possible applications of the 

techniques of the invention are described below for illustration, and a wide range of other 
applications may also be contemplated and is within the scope of the invention. 

[191] The techniques described herein may be used to manipulate data located 
anywhere within a browser window to achieve various results. First, a browser object 

1 0 (for a particular record of data) may be moved to enter, modify, or delete information for 
the record. For example, a record may be moved (e.g., via drag-and-drop) into a 
particular location of the webpage to set the status of the record (e.g., to "Completed"). 
As another example, a record may be moved from one list to another list (e.g., from an 
Available list to a Selected list) to indicate different actions and operations allowed for 

1 5 and/or supported by the record. Second, a browser object may be moved to establish 

relationships between records. For example, a particular personnel may be established as 
an employee of a particular entity by moving the record for the personnel into the record 
for the entity. Third, a browser object may be moved to organize records. For example, a 
record may be moved to set up hierarchies, to put an attachment file represented by the 

20 record into another record, and so on. Fourth, a browser object may be moved to invoke 
certain business processes and/or functionalities. For example, a record for a purchase 
request may be moved to a particular icon to start an approval process (which may be 
associated with a specific set of actions to be performed on the record) or moved to 
another icon to indicate its approval. 

25 [ 1 92] The techniques described herein may also be used to invoke other 

functionalities and processes that may be supported by the browser and/or the computer 
desktop on which the browser is executed First, a browser object may be moved invoke 
certain functionality (e.g., to save or print the record). For example, a record may be 
moved to a particular icon on the webpage or desktop to initiate a print (or a save) of the 

30 record. As another example, a record may be moved to another icon on the webpage or 
desktop to initiate an email to be sent (via various supported communication means 
including wireline and wireless). The record may then be included in the email as an 
attachment, or data in the record maybe extracted to ascertain the recipients of the email. 
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[193] A browser object may be moved between locations within the webpage to 
achieve various results, as described above. A browser object may also be moved from 
the webpage onto the desktop (e.g., to a particular icon on the desktop), and an object 
from the desktop may be moved onto the webpage, to achieve other results. The browser 
objects within the webpage that support such webpage-desktop interaction may be 
designed to recognize and process such interactions. 

[1 94] The following features (some of which may be end application specific) 
may be supported by the techniques described herein: 

• Drag and drop (external) - support a drag of an object from one applet into another 

applet; 

• Drag and drop (internal) - support a drag of an object to a different location within 

the same applet; 

• Unassign - allow an end-user to unassign an activity by dragging it back to 

another applet; 

• Activity resizing - support a "stretch" of an activity within the Gantt chart to 

lengthen/shorten it (can be achieved via various means); 

• Support error messages - drag and drop actions may be able to pass messages back 

from third party scheduling tools to show violation of rules; 

• Flexible business objects - allow an administrator to specify the x and y axes for 

the Gantt chart; 

• Flexible time scale - support hours, days, weeks, and months display on the Gantt 

chart; 

• Day drop down - allow an end-user to pick which day(s) to display on the Gantt 

chart; 

• Today button - moves the Gantt chart to today, 

• Default color settings - allow an end-user to set colors (e.g., default colors); 

• Activity color settings - allow color coding for different Type, Status, and Priority, 

• Full-screen button - a button that expands the chart to a full-size screen; 

• Contract commitment time - show graphically the deadline for an activity; 

• Scrolling - vertical and horizontal scrolling (via scroll buttons if necessary); 

• Dynamic applets - ability to see skills, instructions, and parts for a particular 

activity; 
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Drill down - allow an end-user to drill down on an item by double-clicking on it (a 
pop-up applet or a new applet may then be displayed to provide the requested 
information); 
Tool tips for employees - shows the employee skills; 
Configurable tool tips - allow an end-user to set tool tip contents; 
Multi-line tool tips - show tool tips as multiple lines; 

Service region drop down - allow an end-user to pick a specific service region to 
view; 

Apply skills button - allow an end-user to search for employees based on skills; 
Shift display - show the hours that an end-user is on duty; 
Person drop down - allow an end-user to pick which end-users to view; 
View Options menu - provide a base class that sets options for the dispatch board, 

which can be overridden by the administrator and end-users; 
Assignment Manager button - allow an end-user to invoke the Assignment 

Manager to schedule an activity; and 
Schedule button - allow an end-user to automatically schedule an activity by 
calling a scheduling engine, 

[1 95] The tool tips on the activity boxes may be configured to display a specific 
set of fields. This can be achieved Yia (1) the Tools menu, (2) a configuration file in the 
20 database, or (3) a graphical user interface. 

[196] A default color scheme may be defined, and each end-user may be allowed 
to individually define the colors for various objects and parameters based on the user's 
preference. The default color scheme may be used as the starting point from which other 
customization^ may be made. An option may also be provided to automatically change 
25 die color of the texts (e.g., in the data boxes) based on the background color of the boxes. 
For ease of viewing, light colored texts may be used with dark color background, and vice 
versa. A "Reset to Default" button may also be provided to reset a modified color 
scheme back to the default color scheme. 

[ 1 97] The different color settings may also be used for the Gantt chart and list 
30 applets, depending on the end applications, and may be selectable via the Options menu. 
For example, for a project role, different colors may be used on the display for Requested, 
Assigned Full time, and Assigned Part time. 

23 
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[ 1 98] The scale as well as the division for the Gantt chart may be made 
selectable by the end-user. The division may be in units of minutes, hours, days, weeks, 
months, and so on. The time scale for each tick may be displayed by day or month rather 
than minutes (which may be set via an Options dialog box). Major and minor time axis 
5 labels may also be used, instead of single time axis labels. As an example, months may 
be subdivided into weeks, which then have days listed under those. 

[ 1 99] The search criteria for Employee and Service Region pick lists (i.e., the 
lists that include the employees to be displayed on the Gantt chart) may be specified in 
the Tools menu. The Employee pick list may be set via the Assignment Manager button 
1 0 and may be designed to be aware of an organization structure defined for an end 

application. A search may be performed on a single skill or multiple skills. Multiple 
skills may also be grouped into a single line item (e.g., Microsoft Certified Engineer" 
may represent four different skills). This skill grouping may simplify the Skills pick list 

[200] A calendar dropdown may be provided in an applet to allow the end-user 
1 5 to select the specific date(s) to be displayed in the Gantt chart. A Today button may also 
be provided to move the calendar to today's date. 

[201] 

[202] FIG. 2D shows a webpage 200d for an embodiment of the Options menu, 
which may be used to configure the display of the Gantt chart and list applets for the 
20 dispatch system. In this embodiment, the left-most column of an applet 280 includes 
various fields for selecting the time window and time slot for the Gantt chart. Various 
fields are also provided to allow the end-user to define a unique color scheme and to 
select various colors or color schemes to be used for various activity parameters. The 
end-user is also able to select a particular service region for display. 

25 

Computer System 

[203] FIG. 5 is a block diagram of an embodiment of a computer system 500 that 
maybe used to implement client computer 120 and host computer 1 10 in FIG. 1. As 
shown in FIG. 5, system 500 includes a bus 508 that interconnects major subsystems such 
30 as one or more processors 5 1 0, a memory subsystem 5 1 2, a data storage subsystem 514, 
an input device interface 516, an output device interface 518, and a network interface 
520. 

[204] Bus 508 provides a means for allowing various components and 
subsystems of system 500 to communicate with each other. Many of the subsystems and 
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components of system 500 need not be at the same physical location but may be 
distributed at various locations throughout a communication network. Although bus 508 
is shown in FIG. 5 as a single bus, alternate designs for bus 508 may include multiple 
busses. 

5 [205] Processors) 5 10 perform many of the processing Amotions for system 500 

and communicate with a number of peripheral devices via bus 508. Memory subsystem 
512 and datastorage subsystem 514 store the program codes and data (e.g., webpages) 
that implement various aspects of the invention and further provide the functionality of 
system 500. These program codes (e.g., scripts) and data are then provided to memory 

1 0 subsystem 5 12 and the codes are executed by processors) 510. In a distributed 
environment, the program codes and data may be stored on a number of computer 
systems and used by the processors of these systems. 

[206] Memory subsystem 5 12 typically includes a number of memories 
including a random access memory (RAM) 532 and a read only memory (ROM) 534. 

15 RAM 532 is typically used to store program codes and data (e.g., webpages) during 
program execution and ROM 534 is typically used to store fixed codes and data. 

[207] Data storage subsystem 514 provides persistent (non-volatile) storage for 
program codes and data, and may include a hard disk drive 542, a floppy disk drive 544, 
and other storage devices 546 such as a compact digital read only memory (CD-ROM) 

20 drive, an optical drive, and removable media cartridge disk drive. Each of the storage 
devices may be associated with removable media (e.g., floppy disks, CD-ROMs, 
cartridges). One or more of the storage devices maybe located at remote locations and 
coupled to system 500 via communication network 522. 

[208] Input device interface 516 provides interface with various input devices 

25 such as a keyboard 552, a pointing device 554 (e.g., a mouse, a trackball, a touch pad, a 
graphics tablet, a scanner, or a touch screen), and other input device(s) 556. In general, 
the term "input device" is intended to include all possible types of devices and ways to 
input information into system 500. Via the input devices, the dispatcher is able to select 
and move activities using the drag-and-drop technique, refresh frames, update data, and 

30 perform many other functions. 

[209] Output device interface 518 provides an interface with various output 
devices such as a display 562 and other output device(s) 564. Display 562 maybe a 
cathode ray tube (CRT), a flat-panel device such as a liquid crystal display (LCD), or 
some other visual devices. In general, the term "output device" is intended to include all 
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possible types of devices and ways to output information from system 500 to a human or 
to another machine or computer systems. Via the output devices, the dispatcher is 
provided with the dispatch board and other menus, 

[2 1 0] Network interface 520 provides an interface with outside networks 
5 ■ including network 130. Through network interface 520, system 500 is able to 

communicate with other computer systems coupled to network 130. Network interface 
520 may provide a wireline or wireless interface to network 130. 

[211] Many other devices or subsystems (not shown) may also be coupled to 
system 500. In addition, it is not necessary for all of the devices shown in FIG. 5 to be 

1 0 present to practice the invention. Furthermore, the devices and subsystems may be 

interconnected in configurations different from that shown in FIG. 5. The operation of a 
computer system such as that shown in FIG. 5 is readily known in the art and not 
described in detail herein. The source codes to implement some embodiments of the 
invention may be operatively disposed in memory subsystem 5 12 or stored on storage 

1 5 media such as a hard disk, a floppy disk, or a CD-ROM that is operative with a CD-ROM 
player. 

[212] Headings are included herein for reference and to aid in the locating 
certain sections. These heading are not intended to limit the scope of the concepts 
described therein under, and these concepts may have applicability in other sections 

20 throughout the entire specification. 

[213] The foregoing description of the specific embodiments is provided to 
enable any person skilled in the art to make or use the present invention. Various 
modifications to these embodiments will be readily apparent to those skilled in the art, 
and the generic principles defined herein may be applied to other embodiments without 

25 the use of the inventive faculty. Thus, the present invention is not intended to be limited 
to the embodiments shown herein but is to be accorded the widest scope consistent with 
the principles and novel features disclosed herein, and as defined by the following claims. 
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WHAT IS CLAIMED IS: 



1 LA method for facilitating user interaction in a browser environment, 

2 comprising: 

3 receiving a document having included therein a plurality of source and 

4 target objects and a plurality of scripts; 

5 receiving a first indication of a particular operation being initiated on a 

6 selected source object; 

7 executing a first script associated with the selected source object to 

8 generate a data transfer object having included therein data associated with the selected 

9 source object; 

10 receiving a second indication of the particular operation being completed 

11 on a selected target object; and 

12 executing a second script associated with the selected target object to 

13 operate on the data included in the data transfer object to effectuate the particular 

14 operation. 

1 2. The method of claim 1, wherein the document is a webpage. 

1 3. The method of claim 1 , wherein the particular operation is a drag-and- 

2 drop operation. 

1 4. The method of claim 1 , wherein the particular operation is a stretch 

2 operation- 

1 5. The method of claim 1 , further comprising: 

2 receiving a third indication of the data transfer obj ect being moved into a 

3 representation for a potential target object; and 

4 modifying the representation for the potential target object in response to 

5 receiving the third indication. 

1 6. The method of claim 5, further comprising: 
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2 executing a third script associated with the potential target object to check 

3 the data included in the data transfer object against data associated with the potential 

4 target object, and 

5 wherein the representation is modified based on results of the check. 

1 7. The method of claim 6, further comprising: 

2 changing color of the representation for the potential target object if the 

3 selected source object can be associated with the potential target object, 

1 8, The method of claim 5, further comprising: 

2 receiving a fourth indication of the data transfer object being moved out of 

3 the representation for the potential target object, and 

4 restoring the representation for the potential target object in response to 

5 receiving the fourth indication. 

1 9. The method of claim 1 , wherein the second script initiates a call to 

2 update the selected target object to reflect the completion of the particular operation, 

1 1 0, The method of claim 1, further comprising: 

2 receiving an updated document with updates for the selected source and 

3 target objects. 

1 11. The method of claim 1 , wherein the document includes a plurality of 

2 applets for a plurality of display windows. 

1 12. The method of claim 11, wherein the selected source object is located 

2 in a first applet and the selected target object is located in a second applet. 

1 13. The method of claim 11, wherein the selected source and target 

2 objects are both located in the same applet. 

1 14. The method of claim 11, wherein at least one applet represents a Gantt 

2 chart. 
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1 15. The method of claim 14, wherein the Gantt chart is configurable to 

2 display a specific type of browser objects selected from among a plurality of possible 

3 types of browser objects. 

1 16. The method of claim 1 1 , wherein at least one applet represents a list 

2 applet. 

1 17. The method of claim 1, wherein the first and second indications are 

2 signaled by events fired by a browser used to display the document. 

1 1 8. A document capable of facilitating user interaction in a browser 



2 environment and comprising at least one applet, each applet including at least one 

3 browser object representative of an entity for an end application, and each browser object 

4 associated with a respective set of one or more scripts used to facilitate a set of one or 

5 more operations permitted for the associated browser object 

1 19. The document of claim 18 and comprising a webpage. 

1 20. The document of claim 18, wherein the set of one or more permitted 

2 operations for each browser object includes a drag-and-drop operation. 

1 21 . The document of claim 1 8, wherein the set of one or more permitted 

2 operations for each browser object includes a stretch operation. 

1 22. The document of claim 18, wherein a browser object is a source object 

2 if it is selectable to originate a particular operation, and is a target object if it is selectable 

3 as a destination for a particular operation. 

1 23. The document of claim 18, wherein the one or more scripts for each 

2 browser object are operative to perform a first set of actions if the browser object is 

3 selected as a source object for a particular operation, and to perform a second set of 

4 actions if the browser object is selected as a target object for the particular operation. 
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1 24. The document of claim 23, wherein the first set of actions includes 

2 generating a data transfer object having included therein data associated with the browser 

3 object. 

1 25. The document of claim 23, wherein the particular operation is a drag- 

2 and-drop operation, and wherein the one or more scripts for each browser object 

3 selectable as a target object are further operative to perform a first subset of actions if a 

4 selected source object is dropped onto the target object. 

1 26. The document of claim 25, wherein the one or more scripts for each 

2 browser object selectable as a target object is further operative to perform a second subset 

3 of actions if the selected source object is dragged into the browser object and a third 

4 subset of actions if the selected source object is dragged out of the browser object. 

1 27. A computer program product for facilitating user interaction in a 

2 browser environment, comprising a computer-usable medium having embodied therein 

3 computer-readable program codes for: 

4 describing a document having included therein a plurality of source and 

5 target objects and a plurality of scripts; 

6 receiving a first indication of a particular operation being initiated on a 

7 selected source object; 

g a first script associated with the selected source object and executed to 

9 generate a data transfer object having included therein data associated with the selected 

10 source object; 

I \ receiving a second indication of the particular operation being completed 

12 on a selected target object; and 

1 3 a second script associated with the selected target object and executed to 

14 operate on the data included in the data transfer object to effectuate the particular 

15 operation. 

1 28. The computer program product of claim 27, wherein the particular 

2 operation is a drag-and-drop operation or a stretch operation. 
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1 29. The computer program product of claim 27, wherein the computer- 

2 usable medium is further embodied with computer-readable program codes for 

3 receiving a third indication of the data transfer object being moved into a 

4 representation for a potential target obj ect; 

5 modifying the representation for the potential target object in response to 

6 receiving the third indication; 

7 receiving a fourth indication of the data transfer object being moved out of 

8 the representation for the potential target object; and 

9 restoring the representation for the potential target object in response to 
10 receiving the fourth indication. 

1 30. A computer program product for facilitating user interaction in a 

2 browser environment, comprising: 

3 code for describing a document having included therein a plurality of 

4 source and target objects and a plurality of scripts; 

5 code for receiving a first indication of a particular operation being initiated 

6 on a selected source object; 

7 code for a first script associated with the selected source object and 

8 executed to generate a data transfer object having included therein data associated with 

9 the selected source object; 

10 code for receiving a second indication of the particular operation being 

1 1 completed on a selected target object; 

12 code for a second script associated with the selected target object and 

13 executed to operate on the data included in the data transfer object to effectuate the 

14 particular operation; and 

15 a data storage medium configured to store the codes. 
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